<!DOCTYPE html>
<style>
#target {
position: absolute;
top: 0;
width: 100px;
height: 100px;
background: red;
transition-property: top, background;
transition-duration: 50ms;
transform: translateZ(0);
}
</style>
<script>
'use strict';
if (window.testRunner) {
  testRunner.waitUntilDone();
}
onload = function() {
  var target = document.getElementById('target');
  target.offsetHeight; // Force style recalc
  target.style.top = '100px';
  target.style.background = 'green';
}
if (window.testRunner) {
  document.addEventListener('transitionend', function() {
    testRunner.notifyDone();
  });
}
</script>
<div id="target">This box should transition from red to green.</div>
